<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/view/common/taglibs.jsp"%>
<!DOCTYPE>
<html>
    <head>
        <title>用户登录</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta charset="UTF-8" />
        <%@ include file="/WEB-INF/view/common/pace.jsp"%>
    </head>
<body class="bg-1">
    <!-- 导航栏	start -->
    <jsp:include page="/WEB-INF/view/common/header.jsp" />
    
    <!-- 动画 start -->
    <div role="main" class="site clearfix">
        <div class="context-loader-container" id="site-container">
            <section class="aws-section" id="aws">
                <div class="leaf-header-container">
                    <div class="bg-animation">
                        <img width="300" src="<c:url value="/resources/images/cloud-1.png"/>" class="cloud cloud-1" alt="Cloud-1"/> 
                        <img width="347" src="<c:url value="/resources/images/cloud-2.png"/>" class="cloud cloud-2" alt="Cloud-2"/> 
                        <img width="50" src="<c:url value="/resources/images/corel.png"/>" class="cloud corel" alt="corel"/> 
                        <img width="470" src="<c:url value="/resources/images/cloud-3.png"/>" class="cloud cloud-3" alt="Cloud-3"/> 
                        <img width="762" src="<c:url value="/resources/images/cloud-4.png"/>" class="cloud cloud-4" alt="Cloud-4"/> 
                        <img width="587" src="<c:url value="/resources/images/cloud-5.png"/>" class="cloud cloud-5" alt="Cloud-5"/> 
                        <img width="857" src="<c:url value="/resources/images/cloud-6.png"/>" class="cloud cloud-6" alt="Cloud-6"/>
                    </div>
                    <div class="htmleaf-header-content">
                        <h2>J2EE技术分享<br> 自由分享 源码、Demo下载、高级技术实例教程</h2>
                    </div>
                </div>
            </section>
        </div>
    </div>
    <!-- 动画 end -->
    
    
    <div class='container' style="width: 30%; margin-top: 10px;">
        <form action='<c:url value="/LoginServlet"/>' class='form-signin' role='form' method="get">
            <!-- 默认不记住我 -->
            <input type="hidden" name="rememberMe" value="off" />

            <h2 class='form-signin-heading' style="text-align: center;">用户登录</h2>
            <div class="input-group">
                <input type='text' class='form-control' name="userName" placeholder="输入你的账户" required autofocus />
                <div class="input-group-addon">
                    <i class="fa fa-user"></i>
                </div>
            </div>
            <div style='height: 10px; clear: both; display: block'></div>
            <div class="input-group">
                <input type='password' name="password" class='form-control' placeholder="输入你的密码" required>
                <div class="input-group-addon">
                    <i class="fa fa-key"></i>
                </div>
            </div>
            <div class='checkbox'>
                <label> <input type="checkbox" onclick="javascript:remember()" id="rememberMe">记住登录状态</label>
            </div>
            <span style="color: red; font-size: 14px;">${loginErrorMsg}</span>
            <button class='btn btn-lg btn-primary btn-block' type='submit'>登录</button>
            <div style="text-align: center; margin-top: 25px">
                <a onclick="javascript:location.href='<c:url value="/qqLogin"/>'" href="javascript:;">
                    <img border="0" alt="QQ登录" src="<c:url value="/resources/images/qqlogin.png"/>">
                </a>
            </div>
        </form>
    </div>



    <script type="text/javascript">
        function remember() {
            if ($("#rememberMe").attr("checked") == "checked") {
                $("input[name='rememberMe']").val("on");
            } else {
                $("input[name='rememberMe']").val("off");
            }
        }
    </script>
</body>
</html>

